import Vue from 'vue'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/en' // lang i18n

import '@/styles/index.scss' // global css

import layer from 'vue-layer'
import 'vue-layer/lib/vue-layer.css'

import App from './App'
import axios from 'axios'
import store from './store'
import router from './router'
import request from './utils/request'
import md5 from 'js-md5'
import '@/icons' // icon
import '@/permission' // permission control
import vuescroll from 'vuescroll' //引入vuescroll
import 'vuescroll/dist/vuescroll.css' //引入vuescroll样式

import hljs from 'highlight.js' //导入代码高亮文件
import 'highlight.js/styles/atom-one-dark.css' //导入代码高亮样式
import Contextmenu from 'vue-contextmenujs'

import leMarkdownEditor from 'le-markdown-editor'
/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online! ! !
 */

// set ElementUI lang to EN
Vue.use(ElementUI, { locale })

Vue.config.productionTip = false
Vue.prototype.$axios = axios
Vue.prototype.$layer = layer(Vue)
Vue.prototype.$md5 = md5
Vue.use(vuescroll) //使用
Vue.use(Contextmenu)
//自定义一个代码高亮指令
Vue.directive('highlight', function(el) {
  let highlight = el.querySelectorAll('pre code')
  highlight.forEach(block => {
    hljs.highlightBlock(block)
  })
})
Vue.use(leMarkdownEditor)


async function init() {
  new Vue({
    router,
    store,
    render: h => h(App),
    mounted() {
      request.vm(this) //将当前vm 传递给 util.vm 让其中的提示插件生效
    }
  }).$mount('#app')
}

init()
